PHP

        
<?php
$title = 'PHP Contactform';
$rootUrl = '../../';
include $rootUrl . 'head.php';

// var_dump($_POST);

// 表示ページの変数
$page_flag = 0;
$error = array();

if (!empty($_POST['submit'])) {
 
  if($_POST['postName'] && 8 < strlen($_POST['postName'])){
    array_push($error, '「氏名」は20文字以内で入力してください。');
  }
  if($_POST['postMail'] && !filter_var($_POST['postMail'], FILTER_VALIDATE_EMAIL)){
    array_push($error, '「メールアドレス」は正しい形式で入力してください。');
  }
  $tlo = strtr($_POST['postTel'], array_fill_keys(['-', '(', ')'], ''));
  if($_POST['postTel'] && preg_match('/\A0(\d{1}[-(]?\d{4}|\d{2}[-(]?\d{3}|\d{3}[-(]?\d{2}|\d{4}[-(]?\d{1}|[5789]0[-(]?\d{4})[-)]?\d{4}\z/', $tlo)){
    array_push($error, '「電話番号」はハイフンなしの数字を入力してください。');
  }
  
  // エラーが有ったらそのページに留まる
  if(!empty($error)){
    // var_dump($error);
    $page_flag = 0;
    
  }else{
    // エラーが無かったら各変数に代入
    $hName = h($_POST['postName']);
    $hMail = h($_POST['postMail']);
    // $hTel = h($_POST['postTel']);
    $hTel = h($tlo);
    $hSubject = h($_POST['postSubject']);
    $hContents = h($_POST['postContents']);
    
    // 入力内容の確認の表示
    $page_flag = 1;
  }
} elseif (!empty($_POST['postSubmit'])) {
  
  // 入力された値を変数に代入
  
  //この変数はメールの作成に必要
  $pName = $_POST['p_Name'];
  $pMail = $_POST['p_Mail'];
  $pTel = $_POST['p_Tel'];
  $pSubject = $_POST['p_Subject'];
  $pContents = $_POST['p_Contents'];
  // 送信完了ページの表示
  $page_flag = 2;

  // initialize time zone
  date_default_timezone_set('Asia/Tokyo');
  $_today = date("Y-m-d H:i");

  // 自動送信メール　自分へのメール内容
  $to_me = 'website_create@temma.tokyo';
  $subject_me = 'Portfolioより【お問い合わせ】が届きました';
  $body_me = <<<EOD
    
    ===【入力された内容】===
    
    【お名前】
    {$pName}
    【メールアドレス】
    {$pMail}
    【電話番号】
    {$pTel}
    【件名】
    {$pSubject}
    【お問い合わせ内容】
    {$pContents}
    
    ===【以上、早めに返信必要】===
    【お問い合わせ日時】: {$_today}
    EOD;
  $header_me = 'Return-Path: ' . $pMail . '\r\n';
  $header_me = $header_me . 'From: ' . $pMail;

  // end 自分へのメール--------------------------

  // 自動返信メール 相手先へ
  $subject_you = null;
  $body_you = null;
  // 件名
  $subject_you = '【自動送信】お問い合わせありがとうございます。';
  // 本文
  $body_you = <<<EOD
    
    【お問い合わせフォームからの自動送信】
    この度はお問い合わせ頂きまして
    有難うございます。
    以下の内容で受付を致しました。
    返信までしばらくお待ちいただけますよう
    お願い申し上げます。
    
    =====【お問い合わせ内容】=====
    
    {$pContents}
    
    ==========【以上】==========
    お問い合わせ日時: {$_today}
    Email: website_create@temma.tokyo
    サイト運営者: 天間誠
    
    EOD;
  $header_you = 'Return-Path:' . $to_me . '\r\n';
  $header_you = $header_you . 'From: ' . $to_me;
  // end 相手先への送付メール

  mb_language('Japanese');
  mb_internal_encoding('UTF-8');
  $param = '-f' . $to_me;

  // メール送信　自分へ
  mb_send_mail($to_me, $subject_me, $body_me, $header_me);
  // メール送信　相手へ
  mb_send_mail($pMail, $subject_you, $body_you, $header_you, $param);
}

function h($strData){
  $strData = trim($strData);
  $strData = stripslashes($strData);
  // ENT_QUOTES:スクリプトを入力されても文字列として出力させる
  $strData = htmlspecialchars($strData, ENT_QUOTES, 'UTF-8');
  return $strData;
}

?>
        
      

HTML

        
    <section class="contact-cards">
    <h2 class="cards-title"> Contact</h2>
    <hr id="to_top">
    <div class="contact-items">
      <div class="card-left">
        <div class="sns-icon">
          <ul>
            <li>
              <div class='bx bx-home-alt-2'></div>
              <a href="https://portfolio.temma.tokyo/">
                https://portfolio.temma.tokyo/</a><br><span>ユーザー名: makoto</span><br><span>パスワード: makototemma312</span>
            </li>
            <li>
              <div class='bx bx-mobile-alt'></div>
              090-0000-0000
            </li>
            <li>
              <div class='bx bx-envelope'></div>
              website_create@temma.tokyo
            </li>
            <li>
              <div class='bx bx-map'></div>
              world wide web
            </li>
          </ul>
        </div>
        <div class="card-img">
          <img src="newspaper1537x1026-min.jpg" loading="lazy" alt="My image">
        </div>
        <div>
          <p class="caution">【注意】</p>
          <p>「送信完了」までいくと本当に送信されます。</p>
        </div>
      </div>
      
      <?php if ($page_flag === 1) : ?>
        <!-- 入力内容の確認 -->
        <?php include 'confirm.php'; ?>  
       
      <?php elseif ($page_flag === 2) : ?>
        <!-- 送信完了画面 -->
        <?php include 'send_comp.php'; ?>

      <?php else : ?>
        
        <!-- 入力フォーム -->
        <div class="card-right" id="Contacts">
          <p><span>入力フォーム</span> > 入力内容確認 > 送信完了</p>
          
          <!-- バリデーション表示 -->
          <?php if(!empty($error)): ?>
            <ul class="error_list">
              <?php foreach($error as $val): ?>
                <li><?php echo $val; ?></li>
              <?php endforeach; ?>
            </ul>
          <?php endif; ?>
          
          <form method="post" action="">
            <p>氏名 <span>[必須]</span></p>
            <input type="text" name="postName" id="postName" placeholder="氏名" value="" required>

            <p>メール <span>[必須]</span></p>
            <input type="mail" name="postMail" id="postMail" placeholder="example@mail.com" value="" required>

            <p>電話番号 <span>[必須]</span></p>
            <input type="tel" name="postTel" id="postTel" placeholder="0123456789" value="" required>

            <p>件名 <span>[必須]</span></p>
            <input type="text" name="postSubject" id="postSubject" placeholder="質問・依頼・その他" value="" required>

            <p>お問い合わせ内容 <span>[必須]</span></p>
            <textarea name="postContents" id="postContents" cols="32" rows="14" placeholder="内容..." required></textarea>

            <fieldset>
              <legend>個人情報の取扱い</legend>
              <p>送信して頂いた情報は、お問い合わせへの<br>回答のためのみ使用し、その他の目的で使<br>用したり、無断で第三者へ提供することはご<br>ざいません。</p>
              <div class="checkie">
                <input type="checkbox" name="checkbox" id="checkBox" onclick="checkOn()">
                <!-- <label for="checkBox">個人情報の取扱いに同意します。</label> -->
                <button type="submit" name="submit" value="入力内容を確認する" id="nextBtn" onclick="nextConfirm()" disabled>同意して入力内容を確認する</button>
              </div>
            </fieldset>
          </form>
        </div>
      <?php endif; ?>
    </div><!-- contact-items -->